<template>
  <right-three-template :title="componentData.title" :tabName="componentData.tabName">
    <el-form class="right-panorama">
      <color-normal v-model="commonAttr.scene.backgroundColor" label="背景颜色" format="rgb" @change="onChangeAttr"></color-normal>
      <color-normal v-model="commonAttr.light.hemi.skyColor" label="环境光天光" format="rgb" @change="onChangeAttr"></color-normal>
      <color-normal v-model="commonAttr.light.hemi.groundColor" label="环境光地面光" format="rgb" @change="onChangeAttr"></color-normal>
      <slider-normal v-model="commonAttr.light.hemi.intensity" label="环境光强度" :max="100" :step="1" @change="onChangeAttr"></slider-normal>

      <color-normal v-model="commonAttr.light.directional.color" label="平行光的颜色" format="rgb" @change="onChangeAttr"></color-normal>
      <slider-normal v-model="commonAttr.light.directional.intensity" label="平行光强度" :max="100" :step="1" @change="onChangeAttr"></slider-normal>
      <input-normal v-model="commonAttr.light.position" label="灯光位置(x,y,z)" @change="onChangeAttr"></input-normal>

      <add-img-con :url="commonAttr.url" comAttr="commonAttr" picAttr="url" :height="100" class="margin-left-right-16"></add-img-con>
      <input-normal label="全景图Url" v-model="commonAttr.url" @change="onChangeAttr"></input-normal>
      <textarea-normal label="全景图数据" placeholder="fullWidth,fullHeight,croppedWidth,croppedHeight,croppedX,croppedY" v-model="commonAttr.data" @change="onChangeAttr"></textarea-normal>
    </el-form>
  </right-three-template>
</template>
<script>
import RightThreeTemplate from '@/views/canvas/right/right-three-template.vue';
// import DropdownNormal from '@/views/components/edit/DropdownNormal.vue'
import AddImgCon from '@/views/components/add-img-con.vue'
import InputNormal from '@/views/components/edit/InputNormal.vue'
import TextareaNormal from '@/views/components/edit/TextareaNormal.vue'
import ColorNormal from '@/views/components/edit/ColorNormal.vue'
import SliderNormal from '@/views/components/edit/SliderNormal.vue'

import { canvasUtils } from '@/views/js/canvas-utils'


export default {
  name: "RightPanarama",
  mixins: [canvasUtils],
  components: {
    RightThreeTemplate,
    AddImgCon,
    InputNormal,
    TextareaNormal,
    ColorNormal,
    SliderNormal,
    // DropdownNormal,
  },
  
};
</script>
